@extends('agent.mainlayout')
@section('title')
    <div class="title"><span>商品管理></span></div>
    @endsection
    @section('content')
            <!-- start 商品发布第一步-->
    <div class="list6">
        <div class="main_center">
            <div class="main_center_top">
                <span>您常用的商品分类：</span>
                <select name="" id="">
                    <option value="">请选择</option>
                </select>
            </div>
            <div class="list_one">
                <ul id="cate_one" index="1">
                    @if($categories)
                        @foreach($categories as $k => $c)
                             <li @if($k==0)class="active" @endif data-id="{{$c['id']}}" >{{$c['name']}}</li>
                        @endforeach
                    @endif
                </ul>
            </div>
            <div class="list_one">
                <ul id="cate_two" index="2">

                </ul>
            </div>
            <div class="list_one">
                <ul id="cate_three" index="3">

                </ul>
            </div>
        </div>
        <div id="hiddenValue">
            <input type="hidden" name="cate1">
            <input type="hidden" name="cate2">
            <input type="hidden" name="cate3">
        </div>
        <div class="bottom">您当前选择的商品类别是： <span>服饰鞋帽</span>》<span></span> <span></span></div>
        <div class="Next" id="Next">下一步，填写商品信息</div>
    </div>
    <!-- end 商品发布第一步-->
    <script>

        /********所有ajax加载效果**********/
        $(document).ajaxStart(function(){

            //加载效果
            layer.load(2, {shade: false});

        }).ajaxStop(function(){

            //关闭加载效果
            layer.closeAll("loading");
        });
        /********所有ajax加载效果**********/

        var cate_one = document.getElementById('cate_one').getElementsByTagName('li');
        function bindClick(obj) {
            for (var i = 0; i < obj.length; i++) {
                obj[i].onclick = function () {
                    for (var j = 0; j < obj.length;j++){
                            obj[j].className = '';
                    }
                    this.className = 'active';
                    parent_index = this.parentNode.getAttribute('index');
                    id = this.getAttribute('data-id');
                    var hiddenValue = document.getElementById('hiddenValue').getElementsByTagName("input");
                    var bottomSpan = document.getElementsByClassName('bottom')[0].getElementsByTagName('span')[parent_index-1];
                    hiddenValue[parent_index-1].value = id;
                    bottomSpan.innerHTML = this.innerHTML;
                    getCateDate(id,parent_index);
        }
            }
        }

        $("#Next").on('click',function(){
            var hiddenValue = document.getElementById('hiddenValue').getElementsByTagName("input");
            var url = "/center/goods/add/view/step2?";
            var param = '';
            for (i=0; i<hiddenValue.length;i++){
                 param +="cate"+i+"="+hiddenValue[i].value+"&";
            }
           // alert(param);
            //return;
            url = url+param.substring(0,param.lastIndexOf("&"));
            window.location = url;
        })

        /**
         *  获取数据
         */
        function isempty(obj){
            for(var i in obj){
                return 1
            }
            return 0
        }

        function getCateDate(id,index){
            $.ajax({
                type:"GET",
                url:'/center/goods/category',
                data:{pid:id},
                dataType:"json",
                success:function(res){
                      if(isempty(res)){
                           document.getElementById('Next').className = "Next";
                           var Html = '';
                           for (var n=0;n<res.length; n++){
                                 Html += '<li data-id="'+res[n]['id']+'">'+res[n]['name']+'</li>';
                           }
                           var cateUi = document.getElementsByClassName('main_center')[0].getElementsByTagName('ul');

                           cateUi[index].innerHTML = Html;
                           var cateUli = cateUi[index].getElementsByTagName('li');

                           bindClick(cateUli);
                      }else{
                           document.getElementById('Next').className = "avNext";
                      }

                }
            })
        }


        bindClick(cate_one);
    </script>
@endsection
